<script>
  function showID(elId) {
    if (document.getElementById(elId).style.display == 'block') {
      document.getElementById(elId).style.display = 'none';
      }
    else
      document.getElementById(elId).style.display = 'block';
}

  function switchPiece(sr) {
    document.getElementById('myIfr').src = sr; 
  }
</script>
<div style="text-align: left; padding-left: 2%; padding-right: 2%;">
  <a name="X"></a>
  <h2><? print $sup_proj ?></h2>
  <ul>
    <li><? print $sup_donate ?></li><br />
      &nbsp;&nbsp;&nbsp;&nbsp;<a href="http://sourceforge.net/donate/index.php?group_id=515420"><img src="http://images.sourceforge.net/images/project-support.jpg" width="88" height="32" border="0" alt="Support This Project" /></a><br /><br />
    <li><? print $sup_buyCD ?></li><br />
        ... <a href="#X" onclick="showID('cdDet')"><? print $sup_see ?> </a>...<br />
        <div id="cdDet" style="display: none; text-align: center;">
        <br /><br /><span style="font-size: 150%; font-weight: bold;"><? print $sup_CD_head ?></span><br />
        <? print $sup_CD_cont ?> 51:31<br /><br />
        <a name="Y"></a>
        <img src="Picts/cd-front.jpg" style="width: 49%;" /> 
          <img src="Picts/cd-back.jpg" style="width: 49%;" /><br />
        <br />
        <? print $sup_listen ?><br />
          - <a href="#Y" onclick="switchPiece('http://www.youtube.com/embed/dsglBmK4d04')">
          <? print $sup_elves ?> - IV. Andante Expresivo</a><br />
          - <a href="#Y" onclick="switchPiece('http://www.youtube.com/embed/mmb5-M1B2ug')">
          Parada (blues)</a><br />
          - <a href="#Y" onclick="switchPiece('http://www.youtube.com/embed/WCIrV2TKVYo')">
          <? print $sup_doll ?></a><br />
          - <a href="#Y" onclick="switchPiece('http://www.youtube.com/embed/wi1gECnHnLM?hl')">
          <? print $sup_toy ?></a><br />
          
          <iframe id="myIfr" width="240" height="180" src="http://www.youtube.com/embed/dsglBmK4d04" frameborder="0"></iframe><br /><br />
          <? print $sup_price ?><br /><br />
          <? print $sup_email ?><br />
          <br />
        </div>
    <br />
    <li><? print $sup_spons ?></li><br />
    <li><? print $sup_like ?><br />
    <g:plusone size="Medium" href="http://nootka.sourceforge.net"></g:plusone>&nbsp;&nbsp;&nbsp;&nbsp;
    <div style="width: 100px;" class="fb-like" data-send="false" data-layout="button_count" data-width="450" data-href="http://nootka.sourceforge.net" data-show-faces="false"></div>
    </li>
  </ul>
  <br /><br />
  <h2><? print $sup_feed ?></h2>
  <ul>
    <li> Make translation for Your language<br />
	<a name="Y"></a>
	&nbsp;&nbsp;<a href="#Y" onclick="showID('translateId')">See instructions</a>
	<div id="translateId" style="display: none;">
	<pre>
	    <? include "how-to-translate"; ?>
	</pre>
	</div>  
    </li><br />
    <li><? print $sup_bug ?></li>
    <? print $sup_bug_rep ?> <a href="http://sourceforge.net/tracker/?group_id=515420&atid=2094836">Sourceforge bug tracker</a> system.<br /><br />
    <li><? print $sup_feat ?></li>
    <? print $sup_feat_sub ?> <a href="http://sourceforge.net/tracker/?group_id=515420&atid=2094839">Sourceforge tracker.</a><br /><br />
    <br />
  </ul>
</div>

